import React from 'react';
import {
    Row,
    Col,
    Table,
    Form,
    DatePicker,
    Button,
    message
} from 'antd';
import axios from 'axios';
import intercept from '../../../utils/intercept';
import { config } from 'utils';
import '../less/Rent.less';
import RentTableInfo from './RentTableInfo';
const { RangePicker } = DatePicker;


class RentTable extends React.Component {
    constructor(props) {
        super(props);
        const user = JSON.parse(sessionStorage.getItem("user"));
        this.state = {
            dataSource: [],
            pagination: {
                current: 1,
                pageSize: 10
            },
            keyword: '',
            user: user
        };
    };

    componentDidMount() {
        // this.getBalance();

    };

    dateoOnChange = (date, dateString) => {
        this.setState({
            queryStartDate: dateString[0],
            queryEndDate: dateString[1]
        })
    }

    query = () => {
        this.getBalance(this.state.queryStartDate, this.state.queryEndDate)
    }

    getBalance = (start, end) => {
        this.setState({ loading: true })
        const token = sessionStorage.getItem("token");
        this.setState({ loading: true });
        axios.get(`${config.api}Rental/GetDriverStatics?start=${start}&end=${end}`, { headers: { Authorization: 'Bearer ' + token } })
            .then((data) => {
                if (data.data.result) {
                    const pagination = {
                        ...this.state.driverStatics
                    };
                    // pagination.current = params.page;
                    this.setState({ loading: false, dataSource: data.data.driverStatics, pagination });
                } else {
                    message.warning(data.data.errorMessage);
                    this.setState({ loading: false })
                }
            })
            .catch(err => {
                this.setState({ loading: false });
                intercept;
            })
    }


    render() {
        const columns = [
            {
                title: "发车日期",
                dataIndex: "startDate",
                width: 100
            }, {
                title: "司机",
                dataIndex: "driverName",
                width: 100
            }, {
                title: "人数",
                dataIndex: "count",
                width: 100
            }, {
                title: "总金额",
                dataIndex: "totalMoney",
                width: 100,
            }, {
                title: "线上收款",
                dataIndex: "onlinePay",
                width: 100,
            }, {
                title: "线下收款",
                dataIndex: "downPointName",
                width: 100,
                render: (text, record) => {
                    return (<span>{record.totalMoney - record.onlinePay}</span>)
                }
            }
        ];
        const className = "components-table-demo-nested";
        const expandedRowRender = record => <RentTableInfo driverName={record.driverName} day={record.startDate}  />
        const scroll = {
            y: 600
        };
        return (
            <div>
                <div className="searchCenter">
                    <RangePicker onChange={this.dateoOnChange} />
                    <Button onClick={this.query} style={{ marginLeft: '15px' }} type="primary">查询</Button>
                </div>
                <Row gutter={8}>
                    <Col span={24}>
                        <Table
                            // className="content"
                            {...this.state}
                            style={{ background: 'white', textAlign: 'center' }}
                            rowKey={record => record.key}
                            bordered={true}
                            // className={className}
                            columns={columns}
                            scroll={scroll}
                            expandedRowRender={expandedRowRender}
                        />
                    </Col>
                </Row>
            </div>
        )
    }
}
const CRecord = Form.create()(RentTable);
export default CRecord
